<template>
  <cfg-table :ref="ref"
    :config="config" 
    :loading="loading" 
    :data="data" 
    :columns="columns" 
    :additionalAction="additionalAction" 
    :pageSizeOpts="pageSizeOpts" 
    :pageNavigation="pageNavigation" 
    :queryFormItem="queryFormItem" 
    :collapseFormItem="collapseFormItem" 
    :btnShowFun="btnShowFun" 
    :rowbgc="rowbgc"
    @loadPage="loadPage"
    @handleEdit="handleEdit"
    @handleDelete="handleDelete"
    @handleDetail="handleDetail"
    @handleClick="handleClick"
    @handleDbClick="handleDbClick"
    @handleCreate="handleCreate"
    @handleDeleteMultiple="handleDeleteMultiple"
    @handleSearch="handleSearch"
    @handleReset="handleReset"></cfg-table>
</template>

<script>
const ref='insList';
export default {
  name:ref,
  inject:['anc'],
  data() {
    return {
      ref,
      loading:false,
      pageSizeOpts:[10, 30, 50, 100],
      pageNavigation: { total: 0, pageSize: 10, pageNumber: 1 },
    };
  },
  props: {
    data:{
      default:()=>{
        return []
      }
    }
  },
  watch: {},
  computed: {
    config(){
      return {
          search:true,
          addButton:false,
          batchDeleteButton:false,
          downloadIcon:true,
          uploadIcon:false,
          uploadUrl:'/',
          tableSizeIcon:true,
          fullscreenIcon:false,
          refreshIcon:false,
          columnSettingIcon:true,
          checkColumnDisabled:true,
          action:false,
          additionalAction:true
      }
    },
    columns(){
      return [
          {
            key: 'type',
            title: '所属类型',
            minWidth: 100,
            align: 'center',
            show: true
          },
          {
            key: 'className',
            title: '模型类名',
            minWidth: 100,
            align: 'center',
            show: true
          },
        {
          key: "createdBy",
          title: "创建人账号",
          minWidth: 200,
          align: "center",
          show: true,
        },
        {
          key: "createTime",
          title: "创建时间",
          minWidth: 200,
          align: "center",
          show: true,
        },
        {
          key: "updatedBy",
          title: "修改人账号",
          minWidth: 200,
          align: "center",
          show: true,
        },
        {
          key: "updateTime",
          title: "修改时间",
          minWidth: 200,
          align: "center",
          show: true,
          config:{
            type:'select'
          }
        },
      ]
    },
    additionalAction(){
      return {
          key: 'additionalAction',
          title: '操作',
          slot: 'additionalAction',
          width: 200,
          fixed:'right',
          align: 'center',
          show: true,
          buttons:[
            {title: '查看', event: (row, index) => this.handleDetail(row, index)},
          ]
      }
    },
    queryFormItem(){
        return [
            
        ];
    },
    collapseFormItem(){
        return [
          { title: "模型类名", key: "className", config: { type: "text" } },
          /*{title:'abc1',key:'any1',config:{type:'select'}},
          {title:'abc2',key:'any1',config:{type:'select'}},*/
        ];
    },
    btnShowFun(){
        return function(){
          return true
        }
    },
    rowbgc(){
        return 'red'
    },
  },
  created() {
    
  },
  mounted() {
    this.$nextTick(()=>{
      this.$set(this.anc.vms,this.ref, this);
    })
  },
  methods: {
    loadPage(pageNavigation,filter,orderBy){
      this.anc.queryIns(pageNavigation,filter,orderBy)
    },
    handleEdit(row,index){

    },
    handleDelete(row,index){

    },
    handleDetail(row,index){
      this.anc.showJsonModal(row,index)
    },
    handleClick(row,index){

    },
    handleDbClick(row,index){

    },
    handleCreate(){

    },
    handleDeleteMultiple(selection){

    },
    handleSearch(filter) {
      this.pageNavigation.pageNumber = 1;
      this.loadPage(this.pageNavigation, filter, this.orderBy);
    },
    handleReset() {
      this.pageNavigation.pageNumber = 1;
      this.loadPage(this.pageNavigation, {}, this.orderBy);
    },
  }
};
</script>
<style scoped>
</style>